import Taro, { Component } from "@tarojs/taro";
import { View, Text } from "@tarojs/components";
import "./index.css";
import { request } from "../../utils/illness";
import { AtAccordion, AtList, AtListItem } from "taro-ui";

export default class Index extends Component {
  config = {
    navigationBarTitleText: "首页"
  };
  constructor(props) {
    super(props);
    this.state = {
      open: [],
      list: [],
      len: ""
    };
  }
  componentWillMount() {
    const than = this;
    request("http://ali-disease.showapi.com/disease-type-list").then(res => {
      // console.log(res);
      than.setState({
        list: res.data.showapi_res_body.list,
        len: res.data.showapi_res_body.list.length
      });
      console.log(res);
    });
  }

  componentDidMount() {}

  componentWillUnmount() {}

  componentDidShow() {}

  componentDidHide() {}
  handleClick(index, value) {
    var a = [this.state.len];
    for (var i = 0; i < this.state.len; i++) {
      if (i == index) {
        a[i] = value;
      } else {
        a[i] = false;
      }
    }
    this.setState({
      open: a
    });
  }
  ClickHandle(value) {
    console.log(value);
    Taro.navigateTo({
      url: "../list/index?id=" + value
    });
  }
  render() {
    return (
      <View className="index">
        {this.state.list.map((item, index) => (
          <AtAccordion
            open={this.state.open[index]}
            onClick={this.handleClick.bind(this, index)}
            title={item.typeName}
            key={index}
          >
            <AtList hasBorder={false}>
              {item.subList.map(i => (
                <AtListItem
                  title={i.subName}
                  arrow="right"
                  className="AtList"
                  onClick={() => this.ClickHandle(i.subId)}
                />
              ))}
            </AtList>
          </AtAccordion>
        ))}
      </View>
    );
  }
}
